<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px" size="medium">
      <el-form-item label="登陆账号">
        <i class="el-icon-s-custom"></i>
        <el-input v-model="form.id" style="width:260px"></el-input>
      </el-form-item>
      <el-form-item label="用户名称">
        <i class="el-icon-user"></i>
        <el-input v-model="form.name" style="width:260px"></el-input>
      </el-form-item>
      <el-form-item label="用户密码">
        <i class="el-icon-lock"></i>
        <el-input v-model="form.password" show-password label-width="50px" style="width:260px"></el-input>
      </el-form-item>
      <el-form-item label="就读学校">
        <i class="el-icon-office-building"></i>
        <el-input v-model="form.school" style="width:260px"></el-input>
      </el-form-item>
      <el-form-item label="性别">
        <i class="el-icon-male"></i>
        <i class="el-icon-female"></i>
        <el-radio-group v-model="form.gender">
          <el-radio label="男"></el-radio>
          <el-radio label="女"></el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="电子邮箱">
        <i class="el-icon-message"></i>
      <el-input v-model="form.email" style="width:260px;height:40px"></el-input>
      </el-form-item>
      <el-form-item label="个性签名">
        <i class="el-icon-edit-outline"></i>
        <el-input v-model="form.signature" style="width:260px;height:40px"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
    <Identity ref="legal"></Identity>
  </div>
</template>

<script>
import Identity from './identity'
export default {
  name: 'user_add',
  components: {Identity},
  data () {
    return {
      sameId: true,
      form: {
        id: '',
        name: '',
        password: '',
        school: '',
        gender: '男',
        signature: '',
        email: ''
      }
    }
  },
  mounted () {
    this.$refs.legal.isLegal()
  },
  methods: {
    success: function (msg) {
      this.$notify({
        title: '成功',
        message: msg,
        type: 'success'
      })
    },
    error: function (msg) {
      this.$notify.error({
        title: '错误',
        message: msg
      })
    },
    check_userInfo: function () {
      var id = this.form.id
      var password = this.form.password
      var email = this.form.email
      if (/^[\u2E80-\u9FFF]+$/.test(id)) {
        this.error('账号不允许出现中文')
        return false
      }
      if (!(this.check_param(id) && this.check_param(password))) {
        return false
      }
      var reg = /^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/
      if (reg.test(email)) {
        return true
      } else {
        this.error('邮箱格式不对')
        return false
      }
    },
    check_param: function (param) {
      if (param.length > 12) {
        this.error('账号或密码长度不能超过12')
        return false
      } else if (param.length < 4) {
        this.error('账号或密码长度不小于4')
        return false
      }
      return true
    },
    // 添加用户时判断是否存在该账号,要注意同步问题
    async existId () {
      var that = this
      await this.axios(
        {
          url: 'http://localhost:8080/linearAlgebra/findById',
          method: 'post',
          data: {
            id: that.form.id
          }
        }
      ).then(function (response) {
        if (response.data.length === 0) {
          that.sameId = false
        } else {
          that.sameId = true
          that.error('账号为' + that.form.id + '已存在')
        }
      })
      return that.sameId
    },
    async onSubmit () {
      if (!this.check_userInfo()) {
        return
      }
      var result = await this.existId()
      if (result) {
        return
      }
      this.addUser()
    },
    addUser () {
      var that = this
      this.axios(
        {
          url: 'http://localhost:8080/linearAlgebra/addUser',
          method: 'post',
          data: {
            id: that.form.id,
            username: that.form.name,
            password: that.form.password,
            gender: that.form.gender,
            school: that.form.school,
            email: that.form.email,
            signature: that.form.signature
          }
        }
      ).then(function (response) {
        if (response.data === 1) {
          that.success('添加用户' + that.form.name + '成功')
        } else {
          that.error('添加用户' + that.form.name + '失败')
        }
      })
    }
  }
}
</script>

<style>
</style>
